//这里
require(['./config'],()=>{
    //先引入config ，让配置生效就可以使用配置好的短名称
    require(['template','header','footer','bootstrap','fly','zoom'],(template,header)=>{
      class Detail{
        constructor(){
         
          
          this.getData().then(()=>{
            this.addToCart()
            this.BtnClickJia()
            this.BtnClickJian()
            this.Zoom()
          })
          
        }
       getData(){
        const id = location.search.slice(4)
        return new Promise((resolve, reject)=>{

          $.get('https://xiongmaoyouxuan.com/api/detail',{id} , resp=>{
            if(resp.code ===200){
              const{
                id,
                title,
                price,
                photo,
                type,
                saleNum,
                couponStatus,
                accessoryHints,
                descContentList,
                tbOriginPrice,
                image
              }= resp.data.detail
              //把需要的数据放入this.detail
              this.detail ={
                id,
                title,
                price,
                photo,
                type,
                saleNum,
                couponStatus,
                accessoryHints,
                descContentList,
                tbOriginPrice,
                image
              }
              $('#main').append(
                template('mainTemplate',{...this.detail})
              )
              //渲染完成后
              resolve()
            }
          })
        })
       }
       addToCart(){
         $('#add-to-cart-btn').on('click',()=>{
           //先取，骑出来之后判断购物车里是否已经有数据
           // 如果没有，那就存入当前数据，但是也存一个数组名为下一次做准备
           // 如果有了，那就把取出来的数据push当前这一条再重新存进去
           let cart = localStorage.getItem('cart')
           if(cart){
             //购物车里面已经有数据了
              cart = JSON.parse(cart)
              //判断购物车里已经存好的数据是否在当前数据中
              //如果已经存在就把数量加1（或者加输入框里面的值）
              // 如果不存在就push
              const isExist = cart.some(shop =>{
                return shop.id === this.detail.id
              })
              if(isExist){
                //商品已经存在
                // 用map 修改数据，满足条件就count加完在return，不满足的话就直接return shop本身
                cart = cart.map(shop =>{
                  
                  if(shop.id === this.detail.id){
                    shop.count += $('#pord-num-input').val()*1
                  }
                  return shop
                })
                
              }else{
                // 当前商品还没有被加过购物车
                cart.push({...this.detail , count:$('#pord-num-input').val()-0 , check : true})
              }
              //不管是if else 都要存cart ，那么就放在最后即可
              localStorage.setItem('cart',JSON.stringify(cart))
              
           }else{
             // 购物车为空
             // 把this.detail 展开，再加上count字段，把这个对象放进数组，存入localStorage
             localStorage.setItem('cart',JSON.stringify([{...this.detail , count:$('#pord-num-input').val()-0,check : true}]))
           }
           //调用header的方法计算总数量
           header.calacCartCount()
         })
         $('#add-to-cart-btn').on('click',function(e){
          
         
          $('<div class="fly">').fly({
            
            start:{
              left: e.clientX,  //开始位置（必填）#fly元素会被设置成position: fixed
              top: e.clientY,  //开始位置（必填）
            },
            end:{
              left: $('#cart').offset().left.toFixed()-$(document).scrollLeft(), //结束位置（必填）
              top: $('#cart').offset().top.toFixed()-$(document).scrollTop()  //结束位置（必填）
            },
            speed: 0.8, //越大越快，默认1.2
            vertex_Rtop: 100, //运动轨迹最高点top值，默认20
            onEnd: function(){
              this.destroy()
            } //结束回调
          })
        })
       }
       BtnClickJia(){
         const that = this
          
         $('.jia').on('click',function(){
          
           
            $(this).prev().val($(this).prev().val()*1+1)
          //点击加号后给减号的不可用设置为可用
          $(this).prev().prev().attr('disabled' , false)
         
         
        })
       }
       BtnClickJian(){
         
         
        $('.jian').on('click',function(){
          //$(this).next().val()
          ///取到input里面value的值
         

            $(this).next().val($(this).next().val()-1)
          
          if($(this).next().val() <=1 ){
            $(this).attr('disabled' ,true)
            
          }
        })
      
       }
       Zoom(){
         $('#zhong').elevateZoom({
           gallery:'photo-small'
         })

       }
       
        
      }
      new Detail()
    })
  })
  